<?php
require_once("header.php");
require_once("model/DB.php");
require_once("model/User.php");
require_once("model/Kid.php");
require_once("function/admin.login.php");


$parents = User::getUser('type','parent');

?>
<script>
function edit(id){
	var check_id = 0;
	$("#add_form").children().each(function(i){
		if($(this).children().find('.id').val()==id)
		{	
			
			check_id++;
			
		}
	});
	if(check_id>0){
		return false;
	}
	$.post
	(
		"function/getParent.php",
		{id:id},
		function(data){
			
			var div = $("#kid_form").clone(true);
			
			div.css("display","block");

			div.find(".name").val(data[0].username);
			div.find(".contact").val(data[0].contact);
			div.find(".realname").val(data[0].realname);
			div.find(".id").val(id);	
			div.appendTo($("#add_form"));
		},
		"json"
	);


}

function del(id){
	$.post
	(
		"function/delParent.php",
		{id:id},
		function(data){
			if(data=="del"){
				$("#kid_list").load("pieces/parentlist.php");
				alert("Parent is deleted!");
				$("#add_form").children().each(function(i){
					if($(this).children().find('.id').val()==id)
					{	
						$(this).children().remove();						
					}
				});				
			}
		}
	)
}
$(document).ready(function(){
	$("#kid_table").tablesorter( 
		{widthFixed: true, widgets: ['zebra']} 
	).tablesorterPager({container: $("#pager")});
	
	$("#add").click(function(){
		
		var div = $("#kid_form").clone(true);
		div.css("display","block");
		div.appendTo($("#add_form"));
	});
	
	$(".cancel").click(function(){
		
		$(this).parents().each(function(i){
			if(i==4){
				$(this).remove();
			}
		});
	});	
	
	$(".add_kid").submit(function(){
		form = $(this);
		var name = $(this).find(".name").val();
		var contact = $(this).find(".contact").val();
		var realname = $(this).find(".realname").val();

		var id = $(this).find(".id").val();
		var password = $(this).find(".password").val();
		
		if(!name || !contact || !realname){
			alert("Please complete the forms");
			return false;
		}
		

		
		$.post(
		 "function/addparent.php",
		 {name:name,contact:contact,realname:realname,password:password,id:id},
		 function(data){
			if(data){
				if(data=="added"){
					alert(name+" was added into database!");
					$("#kid_list").load("pieces/parentlist.php");
					form.remove();
				}
				else if(data=="saved"){
					alert(name+" was edited and saved into database!");
					$("#kid_list").load("pieces/parentlist.php");
					form.remove();
				}				
				else{
					alert(data);
				}
			}
			else{
				alert("Connection Error!");
			}
		 }
		);
		return false;
		
	});
});

</script>
<center>
<table id="admin_detail" cellspacing="0" cellpadding="0" >
<tr>
<td id="left_bar" style="border-right:1px solid black;text-align:center; width:100px;">

<br>
<a class="admin_left" href="admin.php">Home</a>
<br>
<br>
<a class="admin_left" href="javascript:void(0)" id="add">Add Parent</a>
</td>
<td>
<div id="kid_list">
<table id="kid_table" class="tablesorter">
	<thead>
		<tr><td>Username</td><td>Kid</td><td>Realname</td><td>Contact</td><td>Action</td></tr>
	</thead>
	<tbody>
	
		<?php
		if($parents){
			
			foreach($parents as $parent){
				$kid=Kid::getKidByParent($parent['id']);
				if(!$kid){
					$kid = "Null";
				}
				?>
				<tr><td><?php echo $parent['username']; ?></td><td><?php echo $kid['name']; ?></td><td><?php echo $parent['realname']; ?></td><td><?php echo $parent['contact']; ?></td><td><a href="javascript:void(0)" class="edit" alt="edit" value="" onclick="edit(<?php echo $parent['id'] ?>)">edit</a> <a href="javascript:void(0)" alt="delete" onclick="del(<?php echo $parent['id'] ?>)">delete</a></td></tr>
				<?php 
			}
		}
		?>
	</tbody>
</table>


<div id="pager" class="pager" style="width:800px;margin-left:5px;margin-top:15px">
					<form>
						<img class="first" src="images/first.png"/>
						<img class="prev" src="images/prev.png"/>
						<input class="pagedisplay" type="text"/>
						<img class="next" src="images/next.png"/>
						<img class="last" src="images/last.png"/>
						<select id="pagesize" class="pagesize">
							 <option value="10" >10</option>
							 <option value="15" >15</option>
							 
						</select>
					</form>
</div>
</div>
<div id="kid_form" style="display:none">
<form class="add_kid">
<table>
	<tr>
		<td>*Login Username</td><td><input type="text" class="name"></td>
	</tr>	
	<tr>
		<td>*Login Password</td><td><input type="password" class="password"></td>
	</tr>
	<tr>
		<td>*Parent Realname</td><td><input type="text" class="realname"></td>
	</tr>
	<tr>
		<td>*Parent Contact</td><td><input type="text" class="contact"></td>
	</tr>	
	<tr>
		<td><input type="submit" value="Save"></td><td><input type="button" class="cancel" value="Cancel"></td>
		<input type="hidden" class="id" value="">
	</tr>
</table>
</form>
</div>
<div id="add_form">
</div>
</td>
</tr>
</table>
</center>